{extend name="property/public/insidePageBase" /}
{block name="title"}房源详情{/block}
{block name="css"}
{__block__}
<style>
    .inputtle {
        /*padding: 0px 15px 0px 25px;*/
        /*text-align: right;*/
    }
    .ninputtBox {
        margin-bottom: 5px;
    }
    .df {
        display: flex;
    }
    .fx1 {
        flex: 1;
    }
    .jz {
        display: flex;
        align-property:center;
        justify-content: center;
    }
    .textove {
        display: -webkit-box !important;
        /*display:-moz-box !important;*/
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-all;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }
    .room-facilities li {
        min-width: 80px;
        height: 60px;
        text-align: center;
        border: 1px solid #ededed;

        float:left;
        position: relative;
        margin: 5px;
        padding: 2px;
    }
    .room-facilities li .room-facilities-name {
        margin-top: 5px;
    }
    .room-facilities li .room-facilities-img {
        height: 50%;
        margin-top: 5px;
    }
    .room-facilities li .room-facilities-img img {
        max-width: 100%;
        height: 100%;
    }
    .room-facilities li .room-facilities-num {
        position: absolute;
        top: 0;
        right: 0;
    }
</style>
{/block}
{block name="body"}
<div class="layuimini-container">
    <div class="layuimini-main  layuimini-form layui-form-pane">
        <div class="layui-row layui-col-space15">
            <div class="layui-tab layui-tab-brief">
                <!--房源信息 add-->
                <div class="layui-row">
                    <div class="layui-col-xs6 layui-col-sm6 layui-col-md6">
                        <div class="layui-carousel" id="roomPicture">
                            <div carousel-item>
                                {if $info['picture']}
                                {foreach $info['picture'] as $k=>$v}
                                <div>
                                    <img src="{$v}" style="width: 100%;height: 100%;" alt="">
                                </div>
                                {/foreach}
                                {else/}
                                <div style="text-align: center;font-size: 28px;font-weight: 800;line-height: 260px;">暂无图片</div>
                                {/if}
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs6 layui-col-sm6 layui-col-md6" style="padding: 0 10px;">
                        <div>
                            <div style="font-size: 20px;font-weight: bold;float:left;">
                                 {$info['housing_title']??''}
                            </div>
                            <div style="clear: both"></div>
                        </div>
                        <hr>

                        <div class="layui-row">
                            <div class="layui-col-xs7">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">房源户型</label>
                                    <div class="layui-input-block">
                                        <input type="text" disabled value="{$info['room_num'] ??''} 室 {$info['who_num'] ??''} 厅 {$info['hall_num'] ??''} 卫" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-xs5">
                                <div class="layui-input-group">
                                    <div class="layui-input-split layui-input-prefix">房源朝向&nbsp;&nbsp;&nbsp;&nbsp;</div>
                                    <input type="text" disabled value="{$info['direction']??''}" placeholder="房源朝向"  class="layui-input">
                                </div>
                            </div>
                        </div>

                        <div class="layui-row">
                            <div class="layui-col-xs6">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">房源租金</label>
                                    <div class="layui-input-block">
                                        <input type="text" value="{$info['room_rent']??''} ¥ / 月" disabled autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-xs6">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">房源押金</label>
                                    <div class="layui-input-block">
                                        <input type="text" value="{$info['room_deposit']??''} ¥ / 期" disabled autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="layui-row">
                            <div class="layui-col-xs6">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">房源面积</label>
                                    <div class="layui-input-block">
                                        <input type="text" value="{$info['room_size']??''} ㎡" disabled autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-xs6">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">物业服务费</label>
                                    <div class="layui-input-block">
                                        <input type="text" value="{$info['property_fee']??''} ¥ / 月" disabled autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <table class="layui-hide" id="resourceLogList" lay-filter="resourceLogList"></table>
                    <script type="text/html" id="remark_tpl">
                        {{# if(d.remark) { }}{{d.remark}}{{# } }}
                    </script>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="js"}
<script>MICROANSWER_DROPDOWAN="mDropdown";</script>
{__block__}
<script>
    var isEdit = {:request()->get('isEdit') == 1 ? 'true' : 'false'};
    layui.use(['carousel','table','mDropdown'], function(){
        var carousel = layui.carousel, mDropdown = layui.mDropdown, table = layui.table;
        //建造实例
        carousel.render({
            elem: '#roomPicture'
            ,width: '100%' //设置容器宽度
            ,arrow: 'hover' //始终显示箭头
            //,anim: 'updown' //切换动画方式
        });
        let housingId = {$info['id']??''};
        <!-- 房源日志 add-->
        var tableLogListId = 'resourceLogList';
        table.render({
            elem: '#'+tableLogListId,
            id:tableLogListId,
            url: '{:url("propertyResourceLogList")}?housing_id='+housingId,
            cols: [[
                {field: 'add_time', width: 168, title: '创建时间', sort: true},
                {field: 'username', width: 108, title: '执行用户',  sort: true},
                {field: 'remark', minWidth: 100, title: '备注说明', templet:'#remark_tpl'},
            ]],
            limits: [10, 15, 20, 25, 50, 100],
            limit: 15,
            page: true,
            height: 'full-120',
        });
        <!-- 房源日志 end-->
    });
</script>
{/block}